﻿<%@ Page Title="" Language="C#" MasterPageFile="~/SIPO.master" AutoEventWireup="false"
    CodeFile="sUserlist.aspx.cs" Inherits="SIPO.Web.Lists.Administration.UserManagement.sUserlist" %>

<asp:Content ID="ctnBody" ContentPlaceHolderID="body" runat="server">
    <link type="text/css" rel="stylesheet" href="<%= ResolveUrl("~/styles/ui.jqgrid.css") %>" />
    <script type="text/javascript" src="<%= ResolveUrl("~/scripts/i18n/grid.locale-id.js") %>"></script>
    <script type="text/javascript" src="<%= ResolveUrl("~/scripts/jquery.jqGrid.min.js") %>"></script>
    <script src="<%= ResolveUrl("~/scripts/helper.js") %>" type="text/javascript"></script>
    <br />
    <div>
        <button id="btnAdd" type="button" onclick="OpenForm('add');">
            Tambah</button>
        <button id="btnEdit" type="button" onclick="OpenForm('edit');">
            Ubah</button>
        <button id="btnDelete" type="button" onclick="OpenForm('delete');">
            Hapus</button>
    </div>
    <br />
    <br />
    <table id="table" class="scroll" cellpadding="0" cellspacing="0">
    </table>
    <div id="pager" class="scroll">
    </div>
    <br />
    <div id="dialog" title="Default dialog">
    </div>
    <asp:HiddenField ID="HfStatus" runat="server" />
    <script type="text/javascript">

        $("#btnAdd").button({ icons: { primary: "ui-icon-plus"} });
        $("#btnEdit").button({ icons: { primary: "ui-icon-pencil"} });
        $("#btnDelete").button({ icons: { primary: "ui-icon-trash"} });

    </script>
    <script type="text/javascript">

        var handlerUrl = '<%= ResolveUrl("~/ajaxhandler/administration/usermanagement/sUserhandler.ashx") %>';
        var status = $('#<%= HfStatus.ClientID %>').val();

        if (status == "-1") {
            $('#table').jqGrid({
                url: handlerUrl + '?method=getdataeksternal',
                datatype: 'json',

                colNames: ['ID', 'Kode User', 'Nama User', 'Email', 'HP', 'Aktif', 'Perusahaan', 'DebtorID', 'Role', 'Sektor'],
                colModel: [
           		{ name: 'UserID', key: true, hidden: true, index: 'USERID', width: 60 },
                { name: 'UserCode', index: 'USERCODE', width: 200, searchoptions: { sopt: ['eq', 'cn']} },
           		{ name: 'UserName', index: 'USERNAME', width: 200, searchoptions: { sopt: ['eq', 'cn']} },
           		{ name: 'Email', index: 'EMAIL', width: 150, searchoptions: { sopt: ['eq', 'cn']} },
           		{ name: 'Mobile', index: 'MOBILE', width: 150, searchoptions: { sopt: ['eq', 'cn']} },
           		{ name: 'IsActive', index: 'ISACTIVE', width: 100, searchoptions: { sopt: ['eq'] }, align: 'Center', formatter: 'checkbox', formatoptions: { disabled: true} },
                { name: 'DebtorName', index: 'DEBTORNAME', width: 150, searchoptions: { sopt: ['eq', 'cn']} },
                { name: 'DebtorID', index: 'DEBTORID', hidden: true, width: 150 },
                { name: 'role', index: 'ROLE', align: 'center', search: false, sortable: false, width: 50 },
                { name: 'sector', index: 'SECTOR', align: 'center', search: false, sortable: false, width: 50 },
           	],
                rowNum: 10,
                id: 'UserID',
                multiselect: true,
                rowList: [5, 10, 15, 20],
                pager: '#pager',
                sortname: 'USERNAME',
                sortorder: "asc",
                viewrecords: true,
                jsonReader: { repeatitems: false },
                width: 'auto',
                height: '100%',
                caption: 'User',
                ajaxGridOptions: { cache: false },
                ondblClickRow: function () {
                    OpenForm('edit');
                },
                gridComplete: function () {
                    var ids = $('#table').jqGrid('getDataIDs');
                    for (var i = 0; i < ids.length; i++) {
                        var _id = $('#table').jqGrid('getCell', ids[i], 'UserID');
                        var _name = $('#table').jqGrid('getCell', ids[i], 'UserName');
                        var _debtorid = $('#table').jqGrid('getCell', ids[i], 'DebtorID');
                        idx = "<a href='javascript:void(0);' class='dialog_link ui-corner-all' title='User Role' onclick=\"onclickButtonRole('" + _id + "', '" + _name + " ');\"><span class='ui-icon ui-icon-newwin'></span>...</a>";
                        sectorId = "<a href='javascript:void(0);' class='dialog_link ui-corner-all' title='Sektor' onclick=\"onclickButtonSector('" + _id + "', '" + _name + " ', '" + _debtorid + "');\"><span class='ui-icon ui-icon-newwin'></span>...</a>";

                        $('#table').jqGrid('setRowData', ids[i], { role: idx, sector: sectorId });
                    }
                }
            });

            $("#table").jqGrid('navGrid', '#pager', { edit: false, add: false, del: false, searchtext: 'Search', refreshtext: 'Refresh' },
        {}, {}, {}, { closeOnEscape: true, multipleSearch: true, closeAfterSearch: true });

        }
        else {
            $('#table').jqGrid({
                url: handlerUrl + '?method=getdatainternal',
                datatype: 'json',

                colNames: ['ID', 'Kode User', 'Nama User', 'Email', 'HP', 'Aktif', 'Role', 'Sektor'],
                colModel: [
           		{ name: 'UserID', key: true, hidden: true, index: 'USERID', width: 60 },
                { name: 'UserCode', index: 'USERCODE', width: 200, searchoptions: { sopt: ['eq', 'cn']} },
           		{ name: 'UserName', index: 'USERNAME', width: 200, searchoptions: { sopt: ['eq', 'cn']} },
           		{ name: 'Email', index: 'EMAIL', width: 150, searchoptions: { sopt: ['eq', 'cn']} },
           		{ name: 'Mobile', index: 'MOBILE', width: 150, searchoptions: { sopt: ['eq', 'cn']} },
           		{ name: 'IsActive', index: 'ISACTIVE', width: 100, searchoptions: { sopt: ['eq'] }, align: 'Center', formatter: 'checkbox', formatoptions: { disabled: true} },
                { name: 'role', index: 'ROLE', align: 'center', search: false, sortable: false, width: 50 },
                { name: 'sector', index: 'SECTOR', align: 'center', search: false, sortable: false, width: 50 },
           	],
                rowNum: 10,
                id: 'UserID',
                multiselect: true,
                rowList: [5, 10, 15, 20],
                pager: '#pager',
                sortname: 'USERNAME',
                sortorder: "asc",
                viewrecords: true,
                jsonReader: { repeatitems: false },
                width: 'auto',
                height: '100%',
                caption: 'User',
                ajaxGridOptions: { cache: false },
                ondblClickRow: function () {
                    OpenForm('edit');
                },
                gridComplete: function () {
                    var ids = $('#table').jqGrid('getDataIDs');
                    for (var i = 0; i < ids.length; i++) {
                        var _id = $('#table').jqGrid('getCell', ids[i], 'UserID');
                        var _name = $('#table').jqGrid('getCell', ids[i], 'UserName');

                        idx = "<a href='javascript:void(0);' class='dialog_link ui-corner-all' title='User Role' onclick=\"onclickButtonRole('" + _id + "', '" + _name + " ');\"><span class='ui-icon ui-icon-newwin'></span>...</a>";
                        sectorId = "<a href='javascript:void(0);' class='dialog_link ui-corner-all' title='Sektor' onclick=\"onclickButtonSector('" + _id + "', '" + _name + " ');\"><span class='ui-icon ui-icon-newwin'></span>...</a>";

                        $('#table').jqGrid('setRowData', ids[i], { role: idx, sector: sectorId });
                    }
                }
            });
            $("#table").jqGrid('navGrid', '#pager', { edit: false, add: false, del: false, searchtext: 'Search', refreshtext: 'Refresh' },
        {}, {}, {}, { closeOnEscape: true, multipleSearch: true, closeAfterSearch: true });

        }


        function onclickButtonRole(id, name) {
            $('#table').jqGrid('resetSelection');

            var urlList = '<%= ResolveUrl("~/lists/administration/usermanagement/sUserRolelist.aspx") %>';
            $('#dialog').load(urlList + '?' + 'method=getdata&UserID=' + id + '&menuId=' + '<%= base.MenuID %>').dialog({ autoOpen: false, modal: false, width: 530, height: 430, title: 'Role untuk ' + name });
            $('#dialog').dialog('open');
        }

        function onclickButtonSector(id, name) {
            $('#table').jqGrid('resetSelection');

            var urlList = '<%= ResolveUrl("~/lists/administration/usermanagement/recUserSectorlist.aspx") %>';
            $('#dialog').load(urlList + '?' + 'method=getdata&UserID=' + id + '&menuId=' + '<%= base.MenuID %>').dialog({ autoOpen: false, modal: false, width: 630, height: 440, title: 'Sub Sub Sektor untuk ' + name });
            $('#dialog').dialog('open');
        }

        function onclickButtonSector(id, name, debtorid) {
            $('#table').jqGrid('resetSelection');
            
            var urlList = '<%= ResolveUrl("~/lists/administration/usermanagement/recUserSectorlist.aspx") %>';
            $('#dialog').load(urlList + '?' + 'method=getdata&UserID=' + id + '&DebtorID=' + debtorid + '&menuId=' + '<%= base.MenuID %>').dialog({ autoOpen: false, modal: false, width: 630, height: 440, title: 'Sub Sub Sektor untuk ' + name });
            $('#dialog').dialog('open');
        }

        function OpenForm(ctl) {

            var formUrl = '<%= ResolveUrl("~/forms/administration/usermanagement/sUserform.aspx") %>';

            var grid = $('#table');
            var selIds = grid.jqGrid('getGridParam', 'selarrrow'),
                selText = [];
            $.each(selIds, function () {
                selText.push(grid.jqGrid('getCell', this, 'UserID'));
            });

            if (ctl == 'edit') {
                if (selIds.length == 0) {
                    alert('Pilih data yang mau di ubah !');
                }
                else if (selIds.length > 1) {
                    alert('Pilih satu record untuk ubah data !');
                }
                else {
                    if (status == -1) {
                        $('#dialog').load(formUrl + '?id=' + selText + '&menuId=' + '<%= base.MenuID %>').dialog({ autoOpen: false, modal: true, width: 500, title: 'Ubah User' });
                        $('#dialog').dialog('open');
                    }
                    else {
                        $('#dialog').load(formUrl + '?id=' + selText + '&menuId=' + '<%= base.MenuID %>' + '&Status=1').dialog({ autoOpen: false, modal: true, width: 500, title: 'Ubah User' });
                        $('#dialog').dialog('open');
                    }
                }
            }
            else if (ctl == "add") {
                if (status == -1) {
                    $('#dialog').load(formUrl + '?menuId=' + '<%= base.MenuID %>').dialog({ autoOpen: false, modal: true, width: 500, title: 'Tambah User' });
                    $('#dialog').dialog('open');
                }
                else {
                    $('#dialog').load(formUrl + '?menuId=' + '<%= base.MenuID %>' + '&Status=1').dialog({ autoOpen: false, modal: true, width: 500, title: 'Tambah User' });
                    $('#dialog').dialog('open');
                }
            }
            else {
                if (selIds.length == 0)
                    alert('Pilih data yang mau di hapus !');
                else {
                    var result = window.confirm('Benar data akan di hapus ?');
                    if (result) {

                        var objUser = new Object();
                        objUser.UserID = encodeURIComponent(selText);
                        jsonData = JSON.stringify(objUser);
                        handlerUrl = '<%= ResolveUrl("~/ajaxhandler/administration/usermanagement/sUserhandler.ashx") %>';
                        CallAjax(handlerUrl, "?method=delete", jsonData);

                        setTimeout("$('#table').trigger('reloadGrid');", 3000);
                    }
                }
            }

        }
    
    </script>
</asp:Content>
